<style>
    #LAY_app_tabsheader li {
        padding-left: 20px;
    }

    #LAY_app_tabsheader li::before {
        content: '';
        position: absolute;
        width: 1px;
        height: 1px;
        background: #999;
        transform: scale(6);
        border-radius: 50%;
        top: 18px;
        left: 12px;
    }

    #LAY_app_tabsheader .layui-this::before {
        background: #3B91FF !important;
    }

    #LAY_app_tabsheader li {
        padding-left: 20px;
    }

    #LAY_app_tabsheader li::before {
        content: '';
        position: absolute;
        width: 1px;
        height: 1px;
        background: #999;
        transform: scale(6);
        border-radius: 50%;
        top: 18px;
        left: 12px;
    }

    .syshead {
        width: 100%;
        height: 95px;
        background: #074fa0 url(/src/images/sylogo.png) no-repeat;
    }

    #LAY_app_tabsheader .layui-this::before {
        background: #3B91FF !important;
    }

    .controllerA {
        display: block;
        height: 95px;
        line-height: 95px;
        color: #fff !important;
        float: right;
        padding: 0 20px;
        /* margin-right: 25px; */
    }

    .controllerA:hover {
        background-color: rgba(0, 0, 0, .2);
    }

    #menuLoding {
        height: 50px;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        text-align: center;
        color: #999;
    }

    /**/
    .class-demo-layer-lockscreen {
        background: url(/src/images/lockscreen.jpg) #16b777;
        background-size: cover;
        color: rgba(255, 255, 255, 1);
    }

    .class-demo-layer-lockscreen .layui-form {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 300px;
        transform: translate(-50%, -50%);
    }

    .class-demo-layer-lockscreen .layui-form>div {
        margin-bottom: 8px;
    }

    .class-demo-layer-pin {
        width: 100%;
        height: 38px;
        padding: 0 8px;
        background-color: rgba(255, 255, 255, .8);
        border: none;
        border-radius: 3px;
        box-sizing: border-box;
    }

    .class-demo-layer-lockscreen .layui-input-suffix {
        pointer-events: auto;
        background-color: rgba(0, 0, 0, .5);
        border-radius: 0 3px 3px 0;
    }

    .class-demo-layer-lockscreen .layui-input-suffix .layui-icon-right {
        cursor: pointer;
        color: #fff;
    }

    /**/
</style>
<div class="layui-layout layui-layout-admin">

    <div class="layui-header">
        <div class="syshead">
            <ul class="layui-nav layui-header-tools" style="float:right">
                <li class="layui-nav-item" lay-unselect style="margin-top: 21px;color: #fff;margin-right: 20px;">
                    <script type="text/html" template id="userifo">
                        <a href="javascript:;" style="color: #fff;">
                            <cite style="color: #fff;">{{ d.truename }}</cite>
                            <i class="layui-icon layui-icon-down layui-nav-more"></i>
                        </a>
                        <dl class="layui-nav-child">
                            <dd><a lay-href="sys/user/user_info.html"><i class="layui-icon">&#xe66f;</i>基本资料</a></dd>
                            <dd><a lay-href="sys/user/modifypassword.html"><i class="layui-icon">&#xe673;</i>修改密码</a></dd>
                            <hr>
                            <dd layadmin-event="lockscreen" style="text-align: center;"><a ><i class="layui-icon">&#xe69a;</i>开启锁屏</a></dd>
                            <hr>
                            <dd layadmin-event="logout" style="text-align: center;"><a><i class="layui-icon">&#xe682;</i>退出</a></dd>
                        </dl>
                    </script>
                </li>
            </ul>
            <a layadmin-event="goback" class="controllerA">回到首页</a>
        </div>
        <!-- 头部区域 -->
    </div>

    <!-- 侧边菜单 -->
    <div class="layui-side layui-side-menu">
        <div class="layui-side-scroll" lay-filter="demo-filter-nav">
            <script type="text/html" template id="TPL_layout">

                <div class="layui-logo" lay-href="" style="display:none">
                    <span>{{ layui.setter.name || 'layuiAdmin' }}</span>
                </div>
            </script>
            <ul class="layui-nav layui-nav-tree" lay-shrink="all" id="LAY-system-side-menu"
                lay-filter="layadmin-system-side-menu">
            </ul>
        </div>
    </div>

    <!-- 页面标签 -->
    <script type="text/html" template lay-done="layui.element.render('nav', 'layadmin-pagetabs-nav')">
        {{# if(layui.setter.pageTabs){ }}
        <div class="layadmin-pagetabs" id="LAY_app_tabs">
            <div class="layui-icon layadmin-tabs-control layui-icon-prev" layadmin-event="leftPage"></div>
            <div class="layui-icon layadmin-tabs-control layui-icon-next" layadmin-event="rightPage"></div>
            <div class="layui-icon layadmin-tabs-control layui-icon-down">
                <ul class="layui-nav layadmin-tabs-select" lay-filter="layadmin-pagetabs-nav">
                    <li class="layui-nav-item" lay-unselect>
                        <a href="javascript:;"></a>
                        <dl class="layui-nav-child layui-anim-fadein">
                            <dd layadmin-event="closeThisTabs"><a href="javascript:;">关闭当前标签页</a></dd>
                            <dd layadmin-event="closeOtherTabs"><a href="javascript:;">关闭其它标签页</a></dd>
                            <dd layadmin-event="closeAllTabs"><a href="javascript:;">关闭全部标签页</a></dd>
                        </dl>
                    </li>
                </ul>
            </div>
            <div class="layui-tab" lay-unauto lay-allowClose="true" lay-filter="layadmin-layout-tabs">
                <ul class="layui-tab-title" id="LAY_app_tabsheader">
                    <li lay-id="/"><i class="layui-icon layui-icon-home"></i></li>
                </ul>
            </div>
        </div>
        {{# } }}
    </script>


    <!-- 主体内容 -->
    <div class="layui-body" id="LAY_app_body">
        <div class="layadmin-tabsbody-item layui-show">
            <iframe src="" frameborder="0" class="layadmin-iframe"></iframe>
        </div>
    </div>

    <!-- 辅助元素，一般用于移动设备下遮罩 -->
    <div class="layadmin-body-shade" layadmin-event="shade"></div>

</div>
<script>
    layui.config({
        base: './src/controller/' // 配置 Layui 第三方扩展模块存放的基础目录
    }).use('layout', layui.factory('layout'))
</script>